<template>
	<div style="margin: 20px;">
		<div class="ui inverted segment" style="width: 50%;margin-left: 27%;">
		  <div class="ui teal inverted statistic" style="margin-left: 2em;" v-for="(item,index) in types">
		    <div class="value"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
		      {{item.type_number}}
		    </font></font></div>
		    <div class="label"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
		      {{item.type}}
		    </font></font></div>
		  </div>
		</div>
		<div class="block" style="width: 50%;margin-left: 25%;">
		  <el-timeline>
			<el-timeline-item v-for="(item,index) in blog_files" :key="index" :timestamp="item.user_id" placement="top">
			  <el-card>
				<h4>{{item.blog_title}}</h4>
				<p>时间:{{item.time_}}</p>
			  </el-card>
			</el-timeline-item>
		  </el-timeline>
		</div>
	</div>
</template>

<script>
	export default{
		data(){
			return{
				types:[{type:"计算机",type_number:120}],
				blog_files:[{blog_title:"啊哈哈哈哈哈",user_id:"hahahah",time_:"2321213212"}]
			}
		},
		created() {
			var that=this
			//获得所有的分类
			axios.get("http://"+that.$store.state.host+":8181/type/findAllType").then(function(res){
				that.types=res.data.map.data
			});
			axios.get("http://"+that.$store.state.host+":8181/blog_file/findAllBlog_bile").then(function(res){
				that.blog_files=res.data.map.data
			})
		}
	}
</script>

<style>
</style>
